﻿HmJS.$Import('log');
HmJS.$Import('util.dom.DataBinding');
//HmJS.$Import('core.domready');

HmJS.register('demo.module.util.dom.databinding', function ($ns) {
	var that = {};

	var DataBinding = $ns.util.dom.DataBinding;

	that.todo1 = function () {
		var o = {
			radio: 'radio1',
			checkbox: ['checkbox1', 'checkbox2'],
			textarea: null
		};

		//bind and assign the data to the fields
		$('form').bindObject(o);

		//bind and do not assign the data to the fields, use textarea2 instead of textarea
		$('form').bindObject(o, {
			mapping: {
				textarea: '[name=textarea2]' //any selector would be accepted
			},
			assign: false
		});

		//unbind
		$('form').unbindObject(o);

		//assign the data to the fields without any binding
		$('form').assignObject(o);

		//still accept mapping options for custom selectors
		//any other options will be ignored
		$('form').assignObject(o, {
			mapping: {
				textarea: '[name=textarea2]' //any selector would be accepted
			}
		});
	};

	that.todo2 = function () {
		var o = {
			radio: 'radio1',
			checkbox: ['checkbox1', 'checkbox2'],
			textarea: null
		};

		//bind with a global change event and a specific change event for the radio property
		$('form').bindObject(o, {
			onChange: function (event, obj, key, oldValue, el) {
				log.info(oldValue);
			},
			onChangeradio: function (event, obj, key, oldValue, el) {
				log.info(key);
			}
		});
	};

	return that;
});
